<template>
	<el-dialog :title="titleMap[mode]" v-model="visible" width="60%" destroy-on-close @closed="$emit('closed')" align-center>
        <el-container>
            <el-header>
                <div class="left-panel">
                    <el-button type="primary" @click="back">确定</el-button>
                </div>
                <div class="right-panel">
                    <div class="right-panel-search">
                        <el-date-picker v-model="search.open_single" :value-format="'YYYY-MM-DD'" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" style="width: 230px"/>
                        <el-input v-model="search.entry_code" placeholder="请输入调仓单号" clearable @keyup.enter="upsearch"></el-input>
                        <el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
                        <el-button type="primary" icon="el-icon-refresh" @click="refresh"></el-button>
                    </div>
                </div>
            </el-header>
            <el-main class="nopadding">
                <scTable ref="table" row-key="id" :apiObj="apiObj" @selection-change="selectionChange" stripe remoteSort remoteFilter border height="600" :params="query">
                    <!-- <el-table-column type="selection" width="50" reserve-selection align="center"></el-table-column> -->
                    <el-table-column label="调箱单号" prop="entry_code" align="center"></el-table-column>
                    <el-table-column label="明细表" type="expand" prop="expand" align="center" width="70">
                        <template #default="props">
                            <div m="4">
                                <scTable :data="props.row.detail" hidePagination hideDo border row-key="id" @selection-change="childChange($event,props.row.id)">
                                    <el-table-column width="150" />
                                    <el-table-column type="selection" width="50" reserve-selection align="center"></el-table-column>
                                    <el-table-column label="状态" width="100" align="center">
                                        <template #default="scope">
                                            <el-tag :type="scope.row.is_delivery == 1 ? 'success' : 'warning'">{{scope.row.is_delivery == 1 ? '已提货' : '未提货' }}</el-tag>
                                        </template>
                                    </el-table-column>
                                    <el-table-column label="入仓单号/唛头" prop="marking" width="150" align="center" />
                                    <el-table-column label="箱号" prop="box_code" width="50" />
                                    <el-table-column label="品类" prop="goods.cate.cate_name" width="80" align="center" />
                                    <el-table-column label="商品型号" prop="goods.goods_name" width="100" align="center" />
                                    <el-table-column label="数量" prop="number" width="80" align="center" />
                                    <el-table-column label="单价" prop="price" width="80" align="center" />
                                    <el-table-column label="供应商" width="150" align="center">
                                        {{props.row.apply && props.row.apply.apply_name}}
                                    </el-table-column>
                                </scTable>
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column label="备注" prop="remark" align="center">
                        <template #default="scope">
                            <el-popover placement="top-start" :width="200" trigger="hover" :content="scope.row.remark">
                                <template #reference>
                                    <el-button style="padding: 5px 0;font-size: 12px" text class="m-2">{{ scope.row.remark.substring(0, 10) }}</el-button>
                                </template>
                            </el-popover>
                        </template>
                    </el-table-column>
                    <el-table-column label="操作人" prop="createStaff.name" align="center"></el-table-column>
                    <el-table-column label="操作时间" prop="create_time" align="center"></el-table-column>
                    <!-- <el-table-column label="调箱单号" prop="orderinfo.entry_code" align="center"></el-table-column>
                    <el-table-column label="入仓单号/唛头" prop="detail.marking" align="center"></el-table-column>
                    <el-table-column label="箱号" prop="detail.box_code" align="center"></el-table-column>
                    <el-table-column label="品类" prop="goods.cate.cate_name" align="center"></el-table-column>
                    <el-table-column label="产品型号" prop="goods.goods_name" align="center"></el-table-column>
                    <el-table-column label="总数量" prop="number" align="center"></el-table-column>
                    <el-table-column label="创建时间" prop="create_time" align="center"></el-table-column>
                    <el-table-column label="备注" prop="remark" align="center">
                        <template #default="scope">
                            <el-popover placement="top-start" :width="200" trigger="hover" :content="scope.row.remark">
                                <template #reference>
                                    <el-button style="padding: 5px 0;font-size: 12px" text class="m-2">{{ scope.row.remark.substring(0, 10) }}</el-button>
                                </template>
                            </el-popover>
                        </template>
                    </el-table-column>
                    <el-table-column label="操作人" prop="orderinfo.createStaff.name" align="center"></el-table-column>
                    <el-table-column label="操作时间" prop="create_time" align="center"></el-table-column> -->
			    </scTable>
            </el-main>
        </el-container>
		<template #footer>
			<el-button @click="visible = false">取 消</el-button>
		</template>
	</el-dialog>
</template>

<script>
export default {
    props:{
        query: { type: Object, default: () => ({}) },
    },
	emits: ['success', 'closed'],
	data() {
		return {
			mode: "add",
			titleMap: {
				add: '选择调仓单',
				edit: '编辑产品',
				show: '查看'
			},
			visible: false,
			isSaveing: false,
            apiObj: this.$API.procure.check.list,
			selection: [],
			search: {
				entry_code: null,
                open_single:null,
			},
            data: [],
            needArr: [],
		}
	},
	mounted() {
        // this.getShop()
	},
	methods: {
		// 显示
		open(mode = 'add') {
			this.mode = mode;
			this.visible = true;
			return this
		},
		// 表单注入数据
		setData(data) {
            this.type = data
		},
        // 选择事件
        selectionChange(selection) {
			this.selection = selection;
		},
        // 选中返回
        back(){
            let delivery = false
            this.selection.map(item=>{
                if(item.is_delivery == 1){
                    delivery = true
                }
            })
            if(delivery){
                this.$message.error('存在已提货的订单，请重新选择') 
                return
            }
            this.$emit('success', this.selection)
            this.visible = false;
        },
        //搜索
		upsearch() {
			this.$refs.table.upData(this.search)
		},
        refresh(){
            for (const key in this.search) {
                this.search[key] = null;
            }
            this.$refs.table.upData(this.search)
        },
		async getShop() {
			var res = await this.$API.procure.order.shop.get();
            this.data = res.data
		},
        childChange(row,id){
            if(this.needArr.length <= 0){
                this.needArr.push({
                    id:id,
                    detail:row
                })
            }else {
                let is_array = false
                this.needArr.forEach((item)=>{
                    if(item.id == id){
                        is_array = true
                        item.detail = row
                    }
                })
                if(!is_array){
                    this.needArr.push({
                        id:id,
                        detail:row
                    })
                }
            }
            let array = []
            this.needArr.map(item=>{
                item.detail.forEach(d=>{
                    array.push(d)
                })
            })
            this.selection = array
        },
	}
}
</script>

<style></style>
